<template>
  <div>
    <basic-container>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>内容审核</el-breadcrumb-item>
        <el-breadcrumb-item>作品</el-breadcrumb-item>
        <el-breadcrumb-item>审核</el-breadcrumb-item>
      </el-breadcrumb>
    </basic-container>
    <avue-form
      ref="form"
      :option="option"
      v-model="form"
      @submit="submit"
      @error="error"
    >
      <!-- 自定义表单标签start -->
      <template slot-scope="scope" slot="labels">
        <div v-if="form.plotlabel.split(';') != 0">
          <el-tag
            v-for="item in form.plotlabel.split(';')"
            :key="item"
            v-text="item"
          ></el-tag
          >&nbsp;
          <!-- <el-tag type="success">标签二</el-tag>&nbsp;
          <el-tag type="info">标签三</el-tag>&nbsp;
          <el-tag type="warning">标签四</el-tag>&nbsp;
          <el-tag type="danger">标签五</el-tag>&nbsp; -->
        </div>
        <div>无</div>
      </template>
      <template slot-scope="{}" slot="labelsLabel">
        <span>标签 </span>
        <el-tooltip
          class="item"
          effect="dark"
          content="标签"
          placement="top-start"
        >
          <i class="el-icon-warning"></i>
        </el-tooltip>
      </template>

      <!-- 通过与拒绝按钮 -->
      <template slot-scope="scope" slot="tgbtn">
        <div>
          <el-button type="success" @click="refuse(1)">通过</el-button>
        </div>
      </template>
      <template slot-scope="scope" slot="jjbtn">
        <div>
          <el-button type="warning" @click="refuse(2)">拒绝</el-button>
        </div>
      </template>
    </avue-form>
  </div>
</template>

<script type="text/javascript" src='https://avuejs.com/cdn/aliyun-oss-sdk.min.js'></script>
<script src="https://avuejs.com/cdn/CryptoJS.js"></script>
<script>
import { common } from "@/api/cat/httpRequest";
import { catUrl } from "@/config/env";
import {
  appBookCheck as baseURL,
  uploadFile,
  bookCategory,
} from "@/api/cat/baseUrls";
export default {
  data() {
    return {
      form: {},
      option: {
        column: [
          {
            type: "upload",
            label: "封面",
            span: 24,
            display: true,
            prop: "cover_url",
            drag: false,
            listType: "picture-img",
            disabled: true,
          },
          {
            label: "书籍名称",
            prop: "book_title",
            span: 13,
            type: "input",
            readonly: true,
          },
          {
            label: "书籍分类",
            prop: "category_id_1",
            span: 13,
            readonly: true,
            placeholder: "书籍分类",
            type: "select",
            search: false,
            dicUrl: `${catUrl + bookCategory.getListByLeave}/1`,
            dicFormatter: (res) => {
              return res.source;
            },
            props: {
              label: "label",
              value: "value",
            },
            disabled: true
          },
          {
            label: "标签",
            prop: "plotlabel",
            span: 13,
            type: "input",
            formslot: true,
            labelslot: true,
            readonly: true,
            placeholder: "标签",
          },
          {
            type: "textarea",
            label: "简介",
            span: 18,
            prop: "book_intro",
            placeholder: "简介",
            readonly: true,
          },
          {
            label: "通过按钮",
            prop: "tgbtn",
            span: 18,
            formslot: true,
            labelslot: true,
          },
          {
            type: "textarea",
            label: "拒绝理由",
            span: 18,
            prop: "refusal_reason",
            placeholder: "拒绝理由",
          },
          {
            label: "拒绝按钮",
            prop: "jjbtn",
            span: 18,
            formslot: true,
            labelslot: true,
          },
        ],
        labelPosition: "right",
        labelSuffix: "：",
        labelWidth: 150,
        menuBtn: false,
        submitBtn: false,
        submitText: "提交",
        emptyBtn: true,
        emptyText: "清空",
        menuPosition: "center",
        gutter: 0,
        tabs: false,
        detail: false,
      },
    };
  },
  async created() {},
  methods: {
    submit(form, done) {
      this.$message.success(JSON.stringify(form));
      done();
    },
    error(err) {
      this.$message.success("请查看控制台");
    },
    //拒绝
    refuse(type) {
      this.$confirm(
        type == 1 ? "确定审核通过?" : "确定拒绝?",
        "王牌特战小提示",
        {
          type: "warning",
        }
      ).then(async () => {
        let userInfo = this.$store.state.user.userInfo;
        this.form.last_update_info = userInfo.username;
        this.form.edit_time = new Date();
        if (type == 1) {
          //通过
          this.form.state = 2;
          this.form.refusal_reason == "";
        } else if (type == 2) {
          //拒绝
          this.form.state = 3;
          if (this.form.refusal_reason == "") {
            return this.$message.error("拒绝理由不能为空");
          }
        }
        let data = await common(
          `${baseURL.updateBookCheck}`,
          this.form,
          null,
          "POST"
        );
        if (data == null) {
          return;
        }
        this.$router.go(-1);
      });
    },
  },
  async mounted() {
    //查询书籍章节详情-连带书籍详情  根据章节id
    let { data } = await common(
      baseURL.getInfoById + "/" + this.$route.query.book_id,
      null,
      null,
      "GET"
    );
    this.form = data;
    // let regEx_img = "http://res.xsdoudou.com/doudoumanager\\s*=\\s*(.*?)[^>]*?>";
    // this.form.chapter_content="<p><img src='http://res.xsdoudou.com/doudoumanager/image.png'></p>"
  },
};
</script>

<style>
</style>